<template>
  <div class="body">
    <div>测试首页</div>

    <div>
      <el-button type="primary">ui按钮测试</el-button>
    </div>

    <hr />

    <!-- 文件上传 -->
    <div>
      文件上传
      <br />
      <input type="file" @click="selectFile" accept="image/*" />
      <hr />
      <el-button type="success" @click="openImage">浏览文件...</el-button>
      <br />
      <span v-if="file">{{ file.name }}</span>
    </div>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { tools } from '../../js/tools'
// import { api } from '../../js/ajax'

const file = ref(null)

const selectFile = event => {
  console.log('selectFile:', event, event.target)
  console.log('选中的文件:', event.target.files)
}

const openImage = () => {
  file.value = null
  tools.openImage(data => {
    file.value = data
  })
}
</script>

<style scoped>
.body {
  margin: 0 1rem;
}
</style>
